<template>
	<view>
		<v-table :columns="columns" :data="tableData">
			<template #cell-operation="{ row }">
				<button @click="handleEdit(row)">编辑</button>
				<hr>
				<button @click="handleDelete(row)">删除</button>
			</template>
		</v-table>
	</view>
</template>

<script setup>
import { ref } from 'vue';

const columns = ref([
	{ prop: 'id', label: 'ID', width: '50px' },
	{ prop: 'name', label: '姓名', width: '150px' },
	{ prop: 'operation', label: '操作' }
]);

const tableData = ref([
	{ id: 1, name: '张三',  },
	{ id: 2, name: '李四', },
	{ id: 3, name: '王五',},
	{ id: 4, name: '赵六', }
]);

const handleEdit = (row) => {
	console.log('编辑', row);
};

const handleDelete = (row) => {
	console.log('删除', row);
};
</script>

<style lang="scss">

</style>
